<template>
  <!-- 修改居民 -->
  <div class="main">
    <div class="select">
      <el-row class="pt">紧急求助详情</el-row>
      <div class="buttom status">
        {{ statustype }}
      </div>
      <div class="buttom">
        <el-row class="pt-title">居民信息</el-row>
        <el-button @click="back">返回</el-button>
        <el-button @click="submit" type="primary" v-if="this.types == 'edit'"
          >提交</el-button
        >
      </div>
      <el-row>
        <el-col :span="6">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="姓名:">
                <el-input v-model="editform.userName"></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="证件类型:">
                <el-select
                  filterable
                  v-model="editform.identifyType"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in identifyTypelist"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select> </el-form-item
            ></el-form>
          </div>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="证件号码:">
                <el-input
                  v-model="editform.identifyNo"
                ></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form label-width="80px" :disabled="true">
            <el-form-item label="居住地址:">
              <el-input v-model="editform.address"></el-input> </el-form-item
          ></el-form>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="手机号码:">
                <el-input
                  v-model="editform.phoneNumber"
                ></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
      </el-row>
    </div>
    <div class="select">
      <el-row class="pt"> <el-row class="pt-title">求助信息</el-row></el-row>
      <el-row>
        <el-col :span="6">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="申请时间:">
                <el-input
                  v-model="editform.createTime"
                ></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="求助类型:">
                <el-select
                  filterable
                  v-model="editform.type"
                  placeholder="请选择"
                  class="type"
                >
                  <el-option
                    v-for="item in helptype"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select> </el-form-item
            ></el-form>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="15">
          <el-form label-width="80px" :disabled="true">
            <el-form-item label="求助内容:">
              <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入内容"
                v-model="editform.content"
                >></el-input
              >
            </el-form-item></el-form
          >
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="附件:">
                <el-input
                  v-model="editform.attachment"
                ></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
      </el-row>
    </div>

    <div class="select">
      <el-row class="pt"> <el-row class="pt-title">处理结果</el-row></el-row>
      <el-row>
        <el-col :span="6">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="紧急度:">
                <el-select
                  filterable
                  v-model="radiusvalue"
                  placeholder="请选择"
                  class="type"
                >
                  <el-option
                    v-for="item in radiustype"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select> </el-form-item
            ></el-form>
          </div>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="处理人:">
                <el-input v-model="editform.dealName"></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
        <el-col :span="6" :offset="3">
          <div>
            <el-form label-width="80px" :disabled="true">
              <el-form-item label="完成时间:">
                <el-input v-model="editform.dealTime"></el-input> </el-form-item
            ></el-form>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="15">
          <el-form label-width="80px">
            <el-form-item label="处理结果:">
              <el-input
                :disabled="types != 'edit'"
                type="textarea"
                :rows="4"
                v-model="editform.result"
                placeholder="请输入内容"
                >></el-input
              >
            </el-form-item></el-form
          >
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: "handleurgent",
  data() {
    return {
      types: "",
      identifyTypelist: [
        { value: 1, label: "身份证" },
        { value: 2, label: "护照" },
        { value: 3, label: "港澳通行证" },
        { value: 4, label: "台胞证" },
        { value: 5, label: "士官证" },
        { value: 6, label: "学生证" },
        { value: 7, label: "其他证件" },
      ],
      identifyType: null,
      helptype: [
        { value: "4", label: "其他" },
        { value: "1", label: "买药" },
        { value: "2", label: "看病" },
        { value: "3", label: "生活用品" },
      ],
      helpvalue: "",
      radiustype: [
        { value: "1", label: "紧急" },
        { value: "2", label: "较急" },
        { value: "3", label: "一般" },
      ],
      radiusvalue: "",
      infoId: null,
      statustype: "求助中",
      contentedit: "",
      page: {
        page_index: 1,
        page_limit: 10,
      },
      page_total: 20, //总条数
      editform: {},
    };
  },
  created() {
    this.infoId = JSON.parse(this.$route.query.id);
    this.types = this.$route.query.type;
    this.initpage();
  },
  mounted() {},
  methods: {
    async initpage() {
      let params = {
        id: Number(this.infoId),
      };
      let { data } = await this.$ajax.lu.getEmergencyInfoById(params);
      console.log(data);
      this.editform = data;
      this.helpvalue = data.level;
      this.radiusvalue = data.state;
      this.radiusvalue = data.type;
    },
    back() {
      this.$router.push({
        name: "urgent",
      });
    },
    async handleSubmit() {
      let params = {
        id: this.editform.id,
        result: this.editform.result,
      };
      let { code } = await this.$ajax.lu.dealEmergency(params);
      if (code == "0000") {
        console.log(999);
        this.$router.push({
          name: "urgent",
        });
      } else {
        console.log(888);
        Message.error("修改失败，请稍后重试");
      }
    },
    submit() {
      this.handleSubmit();
    },
  },
};
</script>

<style scoped>
.main {
  padding: 10px;
}
.nameinfo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* align-item center */
}
.title-span {
  color: red;
  padding-left: 20px;
}
.buttom {
  padding: 10px 0 20px 0;
  /* width: 500px; */
  text-align: right;
}
.select {
  padding: 15px 64px 0px;
}
.nameinfo2 {
  display: flex;
  align-items: center;
}
.content {
  padding: 95px 54px 0px;
}
.pt {
  font-size: 20px;
  font-weight: 600;
  padding-bottom: 10px;
}
.pt-title {
  float: left;
  font-size: 18px;
  font-weight: 450;
  padding-bottom: 10px;
}
.status {
  font-size: 23px;
}
.content-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 40px;
}
.block {
  padding-top: 20px;
  text-align: right;
}
</style>
